<template>
  <!-- 验收 -->
  <a-modal
    :width="500"
    :visible="checkAcceptVisible"
    @ok="handleCheckAcceptSubmit"
    @cancel="handleCheckAcceptClose"
    cancelText="关闭"
    title="验收结果"
  >
    <a-spin :spinning="confirmLoading">
      <a-form layout="horizontal">
        <a-row :gutter="24">
          <a-col>
            <a-form-model-item
              label="验收结果："
              :label-col="{ span: 5 }"
              :wrapper-col="{ span: 16 }"
              prop="checkAcceptResult"
              :rules="$valid.required"
            >
              <a-radio-group
                v-model="checkAccept.checkAcceptResult"
                style="line-height: 35px"
                @change="checkAcceptResultChange"
              >
                <a-radio key="1" value="1">验收通过</a-radio>
                <a-radio key="0" value="0">验收不通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24" v-if="checkAccept.checkAcceptResult == '0'">
          <a-col>
            <a-form-model-item
              :label-col="{ span: 5 }"
              :wrapper-col="{ span: 16 }"
              prop="checkAcceptRemarks"
              :rules="$valid.required"
              label="原因："
            >
              <a-input
                v-model="checkAccept.checkAcceptRemarks"
                type="textarea"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col>
            <a-form-model-item
              :label-col="{ span: 5 }"
              :wrapper-col="{ span: 16 }"
              prop="checkAcceptSignature"
              label="签名"
            >
              <a-button
                style="
                  width: 80px;
                  height: 23px;
                  line-height: 11px;
                  margin-top: 9px;
                  font-size: 11px;
                  border: 1px solid rgb(23, 144, 255);
                  color: rgb(23, 144, 255);
                "
                ><a-icon type="edit" />添加签名</a-button
              >
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
import moment from 'moment'
import { postAction } from '@/api/manage'
import WImageUpload from '@/components/WxImageUpload/WImageUpload'
import WFileUpload from '@/components/WxFileUpload/WFileUpload.vue'

export default {
  name: 'CheckAcceptForm',
  components: {
    WImageUpload,
    WFileUpload,
  },
  computed: {},
  data() {
    return {
      confirmLoading: false,
      checkAcceptVisible: false,
      checkAccept: {
        ids: undefined,
        checkAcceptResult: '1',
        checkAcceptSignature: undefined,
        checkAcceptRemarks: undefined,
      },

      current: 0,
      url: {
        update: '/system/devMaintenance/update',
      },
    }
  },
  created() {},
  methods: {
    moment,
    //START验收
    checkAcceptResultChange() {
      this.$forceUpdate()
    },
    handleCheckAccept(id) {
      this.checkAcceptVisible = true
      this.checkAccept = {}
      this.checkAccept.checkAcceptResult = '1'
      this.checkAccept.ids = id
    },

    handleCheckAcceptSubmit() {
      if (!this.checkAccept.checkAcceptResult) {
        this.$message.error('请选择验收结果')
        return
      }

      if (this.checkAccept.checkAcceptResult == '0') {
        if (!this.checkAccept.checkAcceptRemarks) {
          this.$message.error('请输入原因')
          return
        }
      }

      this.checkAcceptVisible = true
      this.checkAccept.workOrderStatus = '5'
      postAction(this.url.update, this.checkAccept).then((resp) => {
        this.$message.success('验收成功')
        this.handleCheckAcceptClose()
      })
    },
    handleCheckAcceptClose() {
      this.checkAcceptVisible = false
      this.checkAccept = {}
      this.$emit('close')
    },
    //END 验收
  },
}
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Microsoft YaHei', sans-serif;
  background-color: #f0f2f5;
  color: #333;
  padding: 20px;
}
</style>
